<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ taglib prefix="fml" uri="http://java.sun.com/jsp/jstl/fmt" %>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <title>列表</title>
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link rel="stylesheet" href="${pageContext.request.contextPath}/resource/bootstrap4/css/bootstrap.css">
    <script src="${pageContext.request.contextPath}/resource/js/jquery-3.2.1.js"></script>
    <script src="${pageContext.request.contextPath}/resource/bootstrap-treeview/js/bootstrap-treeview.js"></script>
    <script src="${pageContext.request.contextPath}/resource/bootstrap4/js/bootstrap.js"></script>
    <script src="${pageContext.request.contextPath}/resource/My97DatePicker/WdatePicker.js"></script>
</head>
<body>
    <form>
        <input type="hidden" name="pageNum" value="${arg.pageNum}">

        生产日期：<input name="createStart" onclick="WdatePicker({dateFmt:'yyyy-MM'})" value="<fml:formatDate value="${arg.createStart}" pattern="yyyy-MM" />">~<input name="createEnd" onclick="WdatePicker({dateFmt:'yyyy-MM'})" value="<fml:formatDate value="${arg.createEnd}" pattern="yyyy-MM" />">
        <br>
        到期日期：<input name="createStart" onclick="WdatePicker({dateFmt:'yyyy-MM'})" value="<fml:formatDate value="${arg.pastStart}" pattern="yyyy-MM" />">~<input name="pastEnd" onclick="WdatePicker({dateFmt:'yyyy-MM'})" value="<fml:formatDate value="${arg.pastEnd}" pattern="yyyy-MM" />">
        <br>
        关键字：<input name="name" value="${arg.name}">
    </form>
    <button type="button" onclick="searchIt()">查询</button>
    <button type="button" onclick="location='${pageContext.request.contextPath}/food/toInsert'">添加</button>
    <button type="button" onclick="chooseStatis()">删除全部</button>
    <hr>
    <table class="table">
        <tr>
            <td><input type="checkbox" onclick="revChoose()"></td>
            <td>名称</td>
            <td>厂家</td>
            <td>产地</td>
            <td>生产时间</td>
            <td>保质天数</td>
            <td>过期日期</td>
            <td>剩余天数</td>
            <td>操作</td>
        </tr>
        <c:forEach items="${list.list}" var="f">
            <tr>
                <td><input type="checkbox" class="ids" value="${f.id}"></td>
                <td>${f.name}</td>
                <td>${f.vender.name}</td>
                <td>${f.province.city}||${f.town.city}||${f.county.city}</td>
                <td><fml:formatDate value="${f.createDate}" pattern="yyyy-MM-dd"/></td>
                <td>${f.expirationNum}</td>
                <td><fml:formatDate value="${f.expirationDate}" pattern="yyyy-MM-dd"/></td>
                <td>${f.residueNum}</td>
                <td>
                    <a onclick="location='${pageContext.request.contextPath}/food/toInsert?id=${f.id}'">修改</a>
                    <a onclick="del(${f.id})">删除</a>
                </td>
            </tr>
        </c:forEach>
        <tr>
            <td colspan="200">
                <c:forEach items="${list.navigatepageNums}" var="page">
                    <button type="button" onclick="goPage(${page})">${page}</button>
                </c:forEach>
            </td>
        </tr>
    </table>
    <script>
        $(function () {
            if (${warning!=null}){
                alert("${warning}");
                $("input").val(null);
                $("[name='pageNum']").val(${arg.pageNum});
            }
        });

        function goPage(pageNum) {
            $("[name='pageNum']").val(pageNum);
            sub();
        }

        function searchIt() {
            $("[name='pageNum']").val(1);
            sub();
        }

        function sub() {
            location = "${pageContext.request.contextPath}/food/list?"+$("form").serialize();
        }

        function del(id) {
            $.post("${pageContext.request.contextPath}/food/delete",("id",id),function (result) {
                if (result > 0){
                    alert("删除成功");
                    searchIt();
                }
            });
        }

        function revChoose() {
            $(".ids").each(function () {
                $(this).prop("checked",!$(this).prop("checked"));
            });
        }

        function chooseStatis() {
            let ids = $(".ids").map(function () {
                return this.value;
            }).get().join(",");
            if (ids!=null&&ids!=''){
                del(ids);
            }else{
                alert("请勾选删除的记录");
            }
        }
    </script>
</body>
</html>
